/* ... */
		body, h1, h2, h3, h4, h5, h6, hr, p, blockquote, dl, dt, dd, ul, ol, li, pre, form, fieldset, legend, button, input, textarea, th, td { margin:0; padding:0; } 
	    body, button, input, select, textarea { font:12px/1.5tahoma, arial, \5b8b\4f53; } 
	    h1, h2, h3, h4, h5, h6{ font-size:100%; } 
	    address, cite, dfn, em, var { font-style:normal; } 
	    code, kbd, pre, samp { font-family:couriernew, courier, monospace; } 
	    small{ font-size:12px; } 
	    ul, ol { list-style:none; } 
	    a { text-decoration:none; } 
	    a:hover { text-decoration:underline; } 
	    sup { vertical-align:text-top; } 
	    sub{ vertical-align:text-bottom; } 
	    legend { color:#000; } 
	    fieldset, img { border:0; } 
	    button, input, select, textarea { font-size:100%; } 
	    table { border-collapse:collapse; border-spacing:0; }
	    /* ... */
	    body{
	    	background-color: #0d111b;
	    }
		div{
			box-sizing: border-box;
		}
	    .green{
			background-color: green;
	    }
	    .blue{
			background-color: blue;
	    }
	    .main{
    	    width: 400px;
		    height: 600px;
		    border: 1px solid #ccc;
		    margin: 200px auto;
		    text-align: center;
	        box-shadow: 0px 0px 20px 0px #a5773e;
	    }
	    #content{
	    	width: 30px;
	    	height: 60px;
	    	margin: 270px auto;
	    	text-align: center;
	    }
	    #content>i{
	    	width: 30px;
	    	height: 30px;
	    	display: block;
	    	border-radius: 15px;
	    }

	    .transformX{
	    	transform:rotate(180deg);
			-ms-transform:rotate(180deg); /* Internet Explorer */
			-moz-transform:rotate(180deg); /* Firefox */
			-webkit-transform:rotate(180deg); /* Safari 和 Chrome */
			-o-transform:rotate(180deg); /* Opera */
			-webkit-transition: all .15s ease-in-out;
      		transition: all .15s ease-in-out;
	    }

	    .transformY{
	    	transform:rotate(0deg);
			-ms-transform:rotate(0deg); /* Internet Explorer */
			-moz-transform:rotate(0deg); /* Firefox */
			-webkit-transform:rotate(0deg); /* Safari 和 Chrome */
			-o-transform:rotate(0deg); /* Opera */
			-webkit-transition: all .15s ease-in-out;
      		transition: all .15s ease-in-out;
	    }
	    .biu-top{
    	    width: 20px;
		    height: 20px;
		    display: block;
		    border-radius: 15px;
		    position: absolute;
		    top: 201px; /* 451px; */
		    margin-left: 189px;
	    }

	    .biu-bottom{
    	    width: 20px;
		    height: 20px;
		    display: block;
		    border-radius: 15px;
		    position: absolute;
		    top: 779px; /* 531px; */
		    margin-left: 189px;
	    }
		.times{
		    float: left;
		    color: #fff;
		    padding: 5px 5px;
		    opacity: 0.5;
		}
		.result{
			float: right;
		    color: #fff;
		    padding: 5px 5px;
		    opacity: 0.5;
		}
		.msak{
			display: none;
			color: #ffffff;
			font-size: 60px;
			position: absolute;
			width: 400px;
			height: 600px;
			text-align: center;
			padding-top: 80px;
			background-color: #402d1ff0;
			z-index: 1;
		}

		.msak>a{
	        text-decoration: none;
			color: #f5dbdb;
			background-color: #02964b;
			border-radius: 20px;
			padding: 5px 20px;
			font-size: 34px;
			line-height: 180px;
		}
		.msak>.res{
		    width: 400px;
		    display: inline-block;
		    font-size: 30px;
		    margin-top: 50px;
		    color: #1bab1b;
		}
		.msak>.localRes{
		    width: 400px;
		    display: inline-block;
		    font-size: 30px;
		    margin-top: 130px;
		    color: #866868;
		}

		@keyframes roate {
            0% {
                transform: rotateZ(0)
            }
            100% {
                transform: rotateZ(360deg)
            }
        }

        .gameOver{
	    	animation: roate 1s infinite linear;
        }
